<template>
  <div>
    <BasicModal
      @register="register"
      :title="title"
      width="70%"
      :destroyOnClose="true"
      :canFullscreen="false"
      :showOkBtn="false"
      :showCancelBtn="false"
    >
      <BasicTable @register="registerTable" class="table-container">
        <template #toolbar>
          <Button type="primary" @click="openModal(true, {})">添加学院</Button>
        </template>
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'action'">
            <TableAction
              :actions="[
                {
                  label: '编辑',
                  tooltip: '编辑',
                },

                {
                  label: '启用',
                  tooltip: '启用',
                },
                {
                  label: '移除',
                  tooltip: '移除',
                },
              ]"
          /></template>
        </template>
      </BasicTable>
    </BasicModal>
  </div>
  <TransferModal @register="addCollegeRegister"></TransferModal>
</template>

<script lang="ts" setup>
  import { BasicModal, useModal, useModalInner } from '@/components/Modal';
  import { ref } from 'vue';
  import { useMessage } from '@/hooks/web/useMessage';
  import { CustomModalTypeEnum } from '@/enums/publicEnum';
  import { CategoryResult } from '@/api/platform/activityCategory/type';
  import { BasicTable, useTable, TableAction } from '@/components/Table';
  import { getSaasColumns } from './tableData';
  import { getIntendedMember } from '@/api/hby/intendedMembers/index';
  import { Button } from 'ant-design-vue';
  import TransferModal from '../CustomTransfer/TransferModal.vue';
  const [registerTable] = useTable({
    api: getIntendedMember,
    columns: getSaasColumns(),
    showIndexColumn: true,
    clickToRowSelect: false,
    useSearchForm: true,
    showTableSetting: true,
    tableSetting: { fullScreen: true },
    maxHeight: 320,
    actionColumn: {
      width: 120,
      title: '操作',
      fixed: 'right',
      dataIndex: 'action',
    },
    formConfig: {
      labelWidth: 100,
      schemas: [
        {
          field: 'keyWord',
          label: '关键词',
          component: 'Input',
          componentProps: {
            placeholder: '学校搜索',
          },
          colProps: {
            span: 6,
          },
        },
        {
          field: 'status',
          label: '状态',
          component: 'Select',
          componentProps: {
            fieldNames: { label: 'dictLabel', value: 'dictValue' },
            options: [
              {
                dictValue: undefined,
                dictLabel: '全部',
              },
              {
                dictValue: '0',
                dictLabel: '启用',
              },
              {
                dictValue: '1',
                dictLabel: '禁用',
              },
            ],
          },
          colProps: {
            span: 4,
          },
        },
      ],
    },
  });

  const title = ref('');
  const { createMessage } = useMessage();

  const emit = defineEmits(['reload']);

  const [register, { closeModal }] = useModalInner(
    async (data: { type: CustomModalTypeEnum; row: CategoryResult }) => {
      console.log(data);
    },
  );

  const [addCollegeRegister, { openModal, setModalProps }] = useModal();
</script>

<style lang="less" scoped></style>
